<template>
	<div>
		<!-- 头部的导航 -->
		<view class="top">
			<view class="top-1">
				<navigator url="order"><p class="p1">全部</p></navigator>
				<navigator url="daifenpei"><p class="p2"><a href="">1</a><b>待分配</b></p></navigator>
				<navigator url="peisongzhong"><p class="p3">配送中</p></navigator>
				<navigator url="daipingjia"><p class="p4">待评价</p></navigator>
				<p class="p5">已完成</p>
			</view>
			<view class="top-2"></view>
		</view>
		<!-- 订单信息 -->
		<view  v-for="(item,index) in datas" :key="index">
		<view class="info">
			<view class="info-1">
				<p class="p1">{{item.deliveryTime}}</p>
				<p class="p2">交易成功 |</p>
				<p class="p3"><img src="../../static/delete.png" alt=""></p>
			</view>
			<!-- 中间 -->
			<view class="info-2">
				<P><image :src="item.goods.goodsImgList[0].url" mode=""></image></P>
				<P class="p1">{{item.goods.goodsName}}</P>
				<P class="p2">￥{{item.goods.goodsPrice}}</P>
				<P class="p3">x {{item.goodsNumber}}</P>
				<P class="p4">查看产品使用说明</P>
			</view>
			<view class="info-3">
				<P class="p3">￥{{item.goods.goodsPrice*item.goodsNumber}}</P>
				<P class="p2">应付金额:</P>
				<P class="p1">共{{item.goodsNumber}}件</P>
				<view class="v1">
					<!-- <P class="p4">查看物流</P>
					<P class="p5">再次购买</P> -->
					
				</view>
			</view>	
			<!-- 留空 -->
			<view class="v2"></view>
		</view>
		</view>
		<footerS></footerS>
	</div>
</template>

<script>
	
	 export default{
			data() {
				return {
					datas:[]		
				}
			},
			 onUnload: function () {
							wx.reLaunch({
							  url: 'order'
							})
						  },
			onLoad(){
				
					uni.request({
							url:'https://www.zunyishengshui.com/maishui/order/selectMemberIsOk',
							method:'POST',
							data:{
								userId:"12321312312313"
							},
							header:{
								
								'Content-Type': 'application/x-www-form-urlencoded', 
							},
							success: (res) => {
								console.log("成功");
								console.log(res);
								this.text = 'request success';
								this.datas = res.data.data;
								console.log(this.datas);
								// console.log(res.data.data.goodsImglist)
								
								
					},
					
					fail:err=>{
						console.log(err);
					},
					complete:()=>{}
						});	
						
				
			},
	// 		onLoad(){
	// 			const ship = uni.request({
	// 				url:'http://192.144.170.210/maishui/goods/selectAllGoods',
	// 				method:'POST',
	// 				success:function(res){
	// 					console.log(res.data);
	// 				}
	// 			})
	// 		}
		}              
</script>

<style>
	.top .top-1{
		display: flex;
		width: 100%;
		height: 3.12rem;
	}
	.top .top-1 .p2 b{
		margin-top:-8px;
	}
	.top .top-1  a{
		margin-top: -0.43rem;
		margin-left: 3.12rem;
		width: 0.81rem;
		height: 0.81rem;
		line-height: 0.81rem;
		color: rgba(72, 72, 72, 1);
		border-radius: 50%;
		font-size: 10px;
		text-align: center;
		font-family: Arial;
		border: 1px solid rgba(72, 72, 72, 1);
	
	}
	.top .top-1 p{
		/* justify-content: space-around; */
		/* width: 3.125rem; */
		justify-content: space-between;
	/* 	margin-left: 1.66rem; */
	margin-left: 1rem;
		margin-top:0.87rem;
		color: rgba(68, 68, 68, 1);
		font-size: 0.9rem;
		text-align: center;
		font-family: PingFangSC-regular;
	} 
	.top .top-1 .p5{
		color:rgb(59, 156, 219);
		/* width: 60px; */
		border-bottom:2px solid rgb(59, 156, 219);
	}
	.top .top-2{
		height: 0.5rem;
		width: 100%;
		background-color: #f0f0f0;
	}
	/* 订单信息 */
	.info .info-1 p img{
		left: 21.3rem;
		top: 8.25rem;
		width: 1.25rem;
		height: 1.25rem;
		/* background-color: rgba(115, 115, 115, 1); */
	
	}
	.info .info-1 .p1{
		margin-top:0.81rem;
		margin-left: 0.87rem;
		font-size: 0.81rem;
		line-height: 1.25rem;
	}
	.info .info-1 .p2{
		/* float: right; */
		margin-left:13.87rem ;
		margin-top:-1.31rem ;
		font-size: 0.81rem;
		line-height: 1.25rem;
	}
	.info .info-1 .p3{
		/* float: right; */
		margin-top:-1.25rem;
		margin-right: 0.75rem;
		line-height: 1.25rem;
		float: right;
	}
	.info .info-1{
		border-bottom:1px solid #e5e5e5;
		height: 40px;
	}
	/* 第二个 */
	.info .info-2 p image{
		margin-left: 1.75rem;
		margin-top:0.625rem;
		width: 3.12rem;
		height: 3.12rem;
	
	}
	.info .info-2 .p1{
		margin-top:-3.43rem;
		margin-left:6.18rem;
		width: 17.58rem;
		height: 2.12rem;
		line-height: 1.06rem;
		color: rgba(16, 16, 16, 1);
		font-size: 0.75rem;
		text-align: left;
		font-family: PingFangSC-regular;
	}
	.info .info-2 .p2{
		margin-right: 0.625rem;
		margin-top:-2.19rem;
		float: right;
		width: 3.31rem;
		height: 1.06rem;
		line-height: 1.06rem;
		color: rgba(77, 77, 77, 1);
		font-size: 0.75rem;
		text-align: right;
		font-family: PingFangSC-regular;
	
	}
	.info .info-2 .p3{
		float: right;
		/* margin-right: 0.5rem; */
		margin-top: -1.25rem;
		width: 3.02rem;
		height: 1rem;
		line-height: 1rem;
		color: rgba(133, 133, 133, 1);
		font-size: 0.74rem;
		/* text-align: right; */
		font-family: SFUIText-regular;
	
	}
	.info .info-2 .p4{
		float: right;
		width: 6.62rem;
		height: 1.02rem;
		line-height: 1.02rem;
		color: rgba(59, 156, 219, 1);
		font-size: 12px;
		text-align: left;
		font-family: PingFangSC-regular;
	
	}
	.info .info-2 {
		border-bottom:1px solid #e5e5e5;
		height: 5rem;
	}
	/* 第三次 */
	.info .info-3 .p3{
		color: rgba(59, 156, 219, 1);
		font-size: 0.75rem;
		text-align: right;
		font-family: PingFangSC-regular;
	
	}
	.info .info-3 .p1,.info .info-3 .p2,.info .info-3 .p3{
		float: right;
		font-size:0.75rem;
		margin-top:0.625rem;
		margin-right: 0.625rem;
		}
		
	.info .info-3 .p5,.info .info-3 .p4{
		float: right;
		left: 13.25rem;
		border:1px solid #c9c9c9;
		border-radius: 1.37rem;
		width: 4.9rem;
		height: 1.62rem;
		line-height: 1.19rem;
		color: rgba(94, 94, 94, 1);
		font-size: 0.78rem;
		text-align: center;
		font-family: PingFangSC-regular;
		margin-top:2.5rem;
		margin-right: 0.3rem;
		/* margin-left: 20px; */
	
	}
	.info .info-3 .v1{
		margin-top: -1.25rem;
		margin-right: 0.625rem;
		float: right;
		width: 12.5rem;
		height: 5.3rem;
		margin-left: 4.3rem;
	}l
	.info .info-3 {
		/* border-bottom:1px solid #e5e5e5; */
		height: 5rem;
	}
	.info .v2{
		height: 0.5rem;
		width: 100%;
		background-color: #f0f0f0;
	}
	
	
</style>
